﻿@model List<KM.ENT.entKhuyenMai>

@{
    Layout = "~/Areas/ADMIN/Views/Shared/MasterAdmin.cshtml";
}
<div class="row">
    <div class="col-lg-12">
        <div class="box">
            <div class="box-header" data-original-title="">
                <h2><i class="fa fa-picture-o"></i><i class="fa fa-check" id="btnok"></i>Gallery</h2>

                <div class="box-icon">
                    <a href="gallery.html#" class="btn-setting"><i class="fa fa-wrench"></i></a>
                    <a href="gallery.html#" class="btn-minimize"><i class="fa fa-chevron-up"></i></a>
                    <a href="gallery.html#" class="btn-close"><i class="fa fa-times"></i></a>
                </div>
            </div>
            <div class="box-content">

                <div class="row" id="root">
                    @foreach (var item in Model)
                    {
                        <div id="@item.KhuyenMaiId" style="margin-bottom: 10px" class="col-sm-2 col-xs-6 i">

                            <div class="img-r"></div>
                            <img class="img-thumbnail" src="@item.ImageSmall">
                            <span class="tdkm">@item.TieuDe</span>
                        </div>
                    }

                </div>
            </div>
        </div>
        <!--/col-->
    </div>
    <!--/col-->

</div>
@section java{
    <script>
        $(document).ready(function () {
            var i = 0;
            var len = $("#root div[class='col-sm-2 col-xs-6 i']").length - 1;
            function a(i) {
                console.log(i);
                $.ajax({
                    async: false,
                    url: '@Url.Action("Ajax", "KhuyenMai")',
                    type: 'GET',
                    cache: false,
                    data: 'id=' + $("#root div[class='col-sm-2 col-xs-6 i']:eq(" + i + ")").prop("id"),
                    success: function (strhtml) {

                        if (strhtml != "") {
                            $("#" + strhtml + " span").css("color", "red")
                        }
                        if (i < len) {
                            //forcus li
                            if (i < len - 1) {
                                $('body').animate({
                                   // scrollTop: $("#root div[class='col-sm-2 col-xs-6 i']:eq(" + i +1+")").offset().top
                                });
                            }
                            i++;
                            setTimeout(function () { a(i) }, 0);
                        }
                        else {
                            alert("Hoàn thành")
                        }

                    }
                });

            }
            $("#btnok").click(function () {
                a(i);
            });
            var l = 1;
            $(".img-r").click(function () {
                var id = $(this).parent().prop("id");
                $.ajax({
                    async: false,
                    url: '@Url.Action("Ajax", "KhuyenMai")',
                    type: 'POST',
                    cache: false,
                    data: 'Id=' + id,
                    success: function (strhtml) {
                        if (strhtml == "1") {
                            $("#" + id).remove();
                        }
                    }
                });

            });

            $(".i").hover(function () {


                $(this).find(".img-r").show();

            },
            function () {
                $(this).find(".img-r").hide();

            }
            );
        });


    </script>
}